<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
<div id="app">
    <div style="width: 500px;height: 200px;margin: 0 auto; margin-top: 500px; border-radius: 10px; background: #1e45c9">
        <div style="text-align: center">
            <form>
                <div style="font-size: 30px">
                    登录
                </div>
                <div>
                    <label>账号</label>
                    <div>
                        <input type="text" v-model="user.userName"/>
                    </div>
                </div>
                <div>
                    <label>密码</label>
                    <div>
                        <input type="password" v-model="user.password"/>
                    </div>
                </div>
                <div style="margin-top: 10px">
                    <button type="button" @click="login">登录</button>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script src="./js/vue.js"></script>
<script src="./js/axios.min.js"></script>
<script>
    new Vue({
        el:"#app",
        data:{
            user:{},
        },
        methods:{
            login(){
                axios.get("http://localhost:9090/user/login?userName="+this.user.userName+"&password="+this.user.password).then((res)=>{
                    if (res.data.result){
                        window.location.href='./home/home.html?id='+res.data.userId;
                    } else {
                        alert(res.data.msg);
                    }
                })
            },
        },
        created(){

        }
    })
</script>
</html>
